<template>
  <div>
    <el-dialog :title="title" :visible.sync="detailvisible" width="800px" append-to-body class="my-dialog"
               @close="cancel">
      <div>
        <el-row :gutter="10" class="mb8">
          <el-col :span="1.5">
            <el-button
              plain
              icon="el-icon-plus"
              size="mini"
              @click="handleAdd"
              v-hasPermi="['system:sign_category:add']"
            >新增
            </el-button
            >
          </el-col>
        </el-row>
        <el-table v-loading="loading" :data="teamlist" size="small" height="400">
          <el-table-column label="班次名称" prop="name">
            <template slot-scope="scope">
              <el-radio v-model="classesId" :label="scope.row.id">
                {{ scope.row.name }}
              </el-radio>
            </template>
          </el-table-column>
          <el-table-column label="考勤时间" prop="phone">
            <template slot-scope="scope">
              {{`${scope.row.comeTime1}-${scope.row.outNext1?'次日':''}${scope.row.outTime1} ${scope.row.comeTime2&&scope.row.comeNext2?'次日':''}${scope.row.comeTime2 || ''}${scope.row.comeTime2?'-':''}${scope.row.outTime2&&scope.row.outNext2?'次日':''}${scope.row.outTime2 || ''}`}}
            </template>
          </el-table-column>
          <el-table-column
            label="操作"
            align="center"
            class-name="small-padding fixed-width"
          >
            <template slot-scope="scope">
              <el-button
                size="mini"
                type="text"
                icon="el-icon-edit"
                @click="handleUpdate(scope.row)"
                v-hasPermi="['system:sign_category:edit']"
              >修改
              </el-button
              >
              <el-button
                size="mini"
                type="text"
                icon="el-icon-delete"
                @click="handleDelete(scope.row)"
                v-hasPermi="['system:sign_category:remove']"
              >删除
              </el-button
              >
            </template>
          </el-table-column>
        </el-table>
        <pagination
          v-show="total>0"
          :total="total"
          :page.sync="queryParams.pageNum"
          :limit.sync="queryParams.pageSize"
          :layout="layout"
          @pagination="getList"
        />
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitForm" size="small" plain>确 定</el-button>
        <el-button @click="cancel" size="small">取 消</el-button>
      </div>
    </el-dialog>
    <setting :visible.sync="settingVisible" :paramId="paramId" :param="param" @getList="getList" type="allIn"></setting>
  </div>
</template>

<script>
import {listSignCate, delSignCate} from "@/api/system/sign_category";
import setting from "@/components/classes/setting";

export default {
  name: "index",
  props: ['visible', 'param', 'type'], // type allIn 执勤组进入的
  components: {setting},
  data() {
    return {
      teamlist: [],
      detailvisible: false,
      title: '班次管理',
      // 遮罩层
      loading: true,
      // 选中数组
      layout: 'total, sizes, prev, pager, next',
      // 总条数
      total: 0,
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        pointsId: 0,
        realName: '',
        phone: ''
      },
      settingVisible: false,
      paramId: 0,
      classesId: 0
    }
  },
  watch: {
    visible() {
      this.detailvisible = this.visible
      if (this.visible) {
        this.getList()
      } else {
        this.teamlist = []
      }
    }
  },
  created() {
    this.loading = false
  },
  methods: {
    submitForm() {
      if (this.classesId) {
        let itemClass = {}
        for (let item of this.teamlist) {
          if (item.id == this.classesId) {
            itemClass = this.$deepCopy(item)
          }
        }
        this.$emit('classesCheck', itemClass)
        this.cancel()
      } else {
        this.$modal.msgError("选择班次");
      }
    },
    editSetting(id) {
      this.paramId = id
      this.settingVisible = true
    },
    /** 查询定位器列表 */
    getList() {
      this.loading = true;
      listSignCate(this.queryParams).then(response => {
        this.teamlist = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    /** 删除按钮操作 */
    handleDelete(row) {
      const postIds = row.id || this.ids;
      this.$modal.confirm('是否确认删除岗位编号为"' + postIds + '"的数据项？').then(function () {
        return delSignCate(postIds);
      }).then(() => {
        this.getList();
        this.$modal.msgSuccess("删除成功");
      }).catch(() => {
      });
    },
    /** 新增按钮操作 */
    handleAdd() {
      this.paramId = 0
      this.settingVisible = true
    },
    /** 修改按钮操作 */
    handleUpdate(row) {
      this.paramId = row.id
      this.settingVisible = true
    },
    deletUser(row) {
      this.$modal
        .confirm(`确定将该班次移除,是否继续？`)
        .then(function () {
          return delSignCate(row.id);
        })
        .then(() => {
          this.$modal.msgSuccess("移除成功");
          this.getList()
        })
        .catch(() => {
        });
    },
    cancel() {
      this.$emit('update:visible', false)
    },
  }
}
</script>

<style scoped>

</style>
